import { Flex } from "antd";
import { Form, Button } from "antd";

import FirstUrlItem from "./FirstUrlItem";
import ChapterTitleItem from "./ChapterTitleItem";
import ChapterContentItem from "./ChapterContentItem";
import NextBtnItem from "./NextBtnItem";
import BookNameItem from "./BookNameItem";
import { FC } from "react";

const { Item } = Form;
export interface FormData{
    bookName:string;
    firstUrl:string;
    titleSelecter:string;
    contentSelecter:string;
    nextSelecter:string;

}
const DownloadForm:FC<{
onSubmit:(data:FormData) =>void;
}> = ({onSubmit}) => {

    const onFinishFailed = (errorInfo:any) => {
        console.log('Failed:', errorInfo);
    };
    return <Flex justify="center" style={{ padding: 10 }}>
        <Form<FormData>
            onFinish={onSubmit}
            onFinishFailed={onFinishFailed}
        >
            <BookNameItem />
            <FirstUrlItem />
            <Flex gap={10}>
                <ChapterTitleItem />
                <ChapterContentItem />
                <NextBtnItem />
            </Flex>
            <Item label={null}>
                <Flex justify="center">
                    <Button color="default" variant="solid" htmlType="submit">
                        查询
                    </Button>
                </Flex>
            </Item>
        </Form>
    </Flex>
}



export default DownloadForm;